#{extends 'overlay.html' /}
#{set 'moreStyles'}
<style type="text/css">
	.ac_results {
		background: #eee;
		border: 2px solid #bbb;
		border-radius:10px;
		border-top-right-radius: 0;
		border-top-left-radius: 0;
	}
	.ac_results ul {
		list-style: none;
	}
	.ac_results ul li {
		font-size:small;
	}
	
</style>
#{/set}

<script type="text/javascript" src="@{'/public/javascripts/jquery.autocomplete.js/'}"></script>
<div id="crudBlank" class="${type.name}">
	<h2 id="crudBlankTitle">&{'crud.blank.title', type.modelName}</h2>
	<div class="objectForm">
	#{form action:@create(), enctype:'multipart/form-data'}
	#{crud.form fields:['description']}	
	#{crud.custom 'description' }
	<label for="object_description">Description	</label><span class="crudHelp" style="color:red">*</span><br/>
	<textarea id="example"  name="object.description" style="width:100%;min-height:70px;" onclick="f();"></textarea>
	<div style="display:none" class="d">Ex: As a/an product role, description</div>
	<span class="error"></span><br/>
	<a href="#" onclick = "ViewOptions()" name="view-more-link">View more options</a>
	#{/crud.custom}
	#{/crud.form}			
	
	<div class="crudField" name="view-more" style="display:none">
	<label for="object_reporter2">Reporter</label>
	<span id="object_reporter2"><font color="green">${connected.name}</font></span>
	</div>
	
	<div class="crudField" name="view-more" style="display:none">
	<label for="object_successScenario">Success Scenario</label><br/>
	<textarea id="object.successScenario"style="width:100%;min-height:70px;"  name="object.successScenario"></textarea>
	</div>

	<div class="crudField" name="view-more" style="display:none">
	<label for="object_failureScenario">Failure Scenario</label><br/>
	<textarea id="object.failureScenario" style="width:100%;min-height:70px;" name="object.failureScenario"></textarea>
	</div>

	#{if project.hasComponents()>1}
		#{if p!=null || (task!=null && task.component==null)}
			<div class="crudField" name="view-more" style="display:none">
			<label for="object_component">Component</label>
			<select style="min-width:130px" id="object_component" name="object.component@id" onchange="getUsers();getType();">
			#{list items:project.components ,as :'component'}
				#{ifnot component.deleted}
					#{if component.number == 0}<option value="${component.id}">None</option>#{/if}
					#{elseif !component.deleted}<option value="${component.id}">${component.name}</option>#{/elseif}
				#{/ifnot}	
			#{/list}
			</select>
			</div>
		#{/if}
		#{elseif task!=null && task.component!=null && task.component.number!=0}
		<div class="crudField" name="view-more" style="display:none">
		<label for="object_component">Component</label>
		<span><font color="green">${task.component.name}</font></span>
		</div>
		#{/elseif}
	#{/if}#{elseif project.hasComponents()==1}<input type="hidden" id="object_component" name="object.component@id" value="${project.components[0].id}" >#{/elseif}

	#{if project.taskStatuses.size()>0}
		<div class="crudField" name="view-more" style="display:none">
			<label for="object_taskStatus">Status</label>
			<select style="min-width:130px" id="object_taskStatus" name="object.taskStatus@id">
			#{list items:project.taskStatuses ,as :'taskStatus'}
				#{ifnot taskStatus.deleted}<option value="${taskStatus.id}">${taskStatus.name}</option>#{/ifnot}
			#{/list}
			</select>
		</div>
	#{/if}
	
	#{if project.hasTypes()>0}
		<div class="crudField" name="view-more" style="display:none">
		<label for="object_taskType">Type</label>
		<select style="min-width:130px" id="object_taskType" name="object.taskType@id" onchange="getType();">
		#{list items:project.taskTypes ,as :'taskType'}
			#{ifnot taskType.deleted}<option value="${taskType.id}">${taskType.name}</option>#{/ifnot}
		#{/list}
		</select>
		</div>
	#{/if}
	
	#{if (p!=null || (component!=null && component.number==0)) && project.hasUsers()>0}
		<div class="crudField" name="view-more" style="display:none">
		<label for="object_assignee">Assignee</label>
		<span style="display:none" id="assig_msg"><font color="red">There are no users in the selected component</font></span>
		<select style="min-width:130px" class="assign" id="object_assignee" name="object.assignee@id" onchange = "getType();">
		<option value="">None</option>
		#{list items:project.users ,as :'user'}
			#{ifnot user.deleted}<option value="${user.id}">${user.name}</option>#{/ifnot}
		#{/list}
		</select>
	#{/if}
	#{elseif component!=null && component.hasUsers()>0}
		<div class="crudField" name="view-more" style="display:none">
		<label for="object_assignee">Assignee</label>
		<span style="display:none" id="assig_msg"><font color="red">There are no users in the selected component</font></span>
		<select style="min-width:130px" class="assign" id="object_assignee" name="object.assignee@id" onChange = "getType();">
		<option value="">None</option>
		#{list items:component.componentUsers ,as :'user'}
			#{ifnot user.deleted}<option value="${user.id}">${user.name}</option>#{/ifnot}	
		#{/list}
		</select>
	#{/elseif}
	#{elseif task!=null && task.component.hasUsers()>0}
		<div class="crudField" name="view-more" style="display:none">
		<label for="object_assignee">Assignee</label>
		<span style="display:none" id="assig_msg"><font color="red">There are no users in the selected component</font></span>
		<select style="min-width:130px" class="assign" id="object_assignee" name="object.assignee@id" onChange = "getType();">
		<option value="">None</option>
		#{list items:task.component.componentUsers ,as :'user'}
			#{ifnot user.deleted}<option value="${user.id}">${user.name}</option>#{/ifnot}
		#{/list}	
		</select>
	#{/elseif}
	</div>
	
	#{if ((p!=null || (component!=null && component.number==0)) && project.hasUsers()>0) || (component!=null && component.hasUsers()>0) || (task!=null && task.component.hasUsers()>0)}
	<div class="crudField" name="view-more" style="display:none">
	<label for="object_reviewer">Reviewer</label>
	<span id="rev_msg" ><font color="red">There are no reviewers available for the selected task type</font></span>
	<select style="min-width:130px" class="rev" id="object_reviewer" name="object.reviewer@id">
	</select>
	</div>
	#{/if}
	
	#{if sprints.size()>0}
	<div class="crudField" name="view-more" style="display:none">	
	<label for="object_taskSprint">Sprint</label>
	<select style="min-width:130px" id="object_taskSprint" name="object.taskSprint@id">
	<option value="">None</option>
	#{list items:sprints ,as :'sprint'}
	<option value="${sprint.id}">Sprint ${sprint.sprintNumber}</option>
	#{/list}
	</select>
	#{/if}
	#{elseif project.sprints.size()>0}
	<div class="crudField" name="view-more" style="display:none">	
	<label for="object_taskSprint">Sprint</label>
	<span><font color="red">There are currently no upcoming sprints</font></span>
	#{/elseif}
	</div>
	
	<div class="crudField" name="view-more" style="display:none">
	<label for="object_estimationPoints">Estimation Points</label>
	<input id="object_estimationPoints" type="text" name="object.estimationPoints" size="5"/> 
	<span class="crudHelp" >Numeric.</span>
	</div>

	#{if project.hasPriorities()>0}
	<div class="crudField" name="view-more" style="display:none">
	<label for="object_priority">Priority</label>
	<select style="min-width:130px" id="object_priority" name="object.priority">
	<option value="">None</option>
	#{list items:project.priorities ,as :'priority'}
		#{ifnot priority.deleted}<option value="${priority.priority}">${priority.priority}</option>#{/ifnot}
	#{/list}
	</select>
	</div>
	#{/if}
	
	#{if project.hasTasks()>0}
	<div class="crudField" name="view-more" style="display:none">	
	<label for="object_dependentTasks">Dependent Tasks</label><br/>
	<input type="hidden" name="object.dependentTasks@id" value="" />
	<select id="object_dependentStories" name="object.dependentTasks@id" style="width:100%;min-height:70px;margin:10px 0" multiple="yes">
	#{list items:project.projectTasks ,as :'task2'}
		#{ifnot task2.deleted}<option value="${task2.id}">${task2.description}</option>#{/ifnot}
	#{/list}
	</select>
	</div>
	#{/if}
	
	<a href="#" onclick = "HideOptions()" name="hide-more-link">Hide extra options</a>
	
	#{if project!=null}
	<input type="hidden" id="object_project" name="object.project@id" value="${project.id}" >
	#{/if}
	#{if component!=null}
	<input type="hidden" id="object_component" name="object.component@id" value="${component.id}" >
	#{/if}
	#{elseif task!=null}
	<input type="hidden" id="object_project" name="object.project@id" value="${task.project.id}" >
	<input type="hidden" id="object_component" name="object.component@id" value="${task.component.id}" >
	<input type="hidden" id="object_parent" name="object.parent@id" value="${task.id}" >
	#{/elseif}
		
		<p class="crudButtons">
			<input type="submit" name="_save" value="&{'crud.save', type.modelName}" />
		</p>
	</div>	
	#{/form}
	</div>


<script type="text/javascript">
	$(function()
	{
		getType();
		$("[name='hide-more-link']").css('display','none');
	})
	var data='${productRoles}'.split("-");
	$("#example").autocomplete(data);
	
	function f()
	{
		$('.d').css('display','inline-block');
	}

function ViewOptions(){
	$("[name='view-more-link']").css('display','none');
	$("[name='hide-more-link']").css('display','inline-block');
	$("[name='view-more']").slideDown();	
}
function HideOptions()
{
	$("[name='hide-more-link']").css('display','none');
	$("[name='view-more-link']").css('display','inline-block');
	$("[name='view-more']").slideUp();
}
function getUsers()
{
	var compId = $('#object_component').val();
	var typeId = $('#object_taskType').val();
	$.post('@{component_users}', {id : compId}, function(data){
		str = '<option value="">(None)</option>';
		$.each(data, function(id, item){
			str += '<option value='+item.id+'>'+item.name+'</option>';
		});
		$('#object_assignee').html( str );
		if (data.length == 0) {
			$('.assign').css('display', 'none');
			$('#assig_msg').css('display', 'inline-block');
		}
		else 
		{
			$('#assig_msg').css('display', 'none');
			$('.assign').css('display', 'inline-block');
		}
	}); 
		
	$.post('@{type_reviewer}', {type_id : typeId, component_id:compId}, function(data){
		str = '<option value="">(None)</option>';
		$.each(data, function(id, item){
			str += '<option value='+item.id+'>'+item.name+'</option>';
		});
		$('#object_reviewer').html( str );
	}); 
}
function getType()
{
	var compId = $('#object_component').val();
	var typeId = $('#object_taskType').val();
	var assigneeId = $('#object_assignee').val();
	$.post('@{type_reviewer}', {type_id : typeId, component_id:compId, assigneeId:assigneeId}, function(data){
		str = '<option value="">(None)</option>';
		$.each(data, function(id, item){
			str += '<option value='+item.id+'>'+item.name+'</option>';
		});
		$('#object_reviewer').html( str );
		if (data.length == 0) {
			$('.rev').css('display', 'none');
			$('#rev_msg').css('display', 'inline-block');
		}
		else 
		{
			$('.rev').css('display', 'inline-block');
			$('#rev_msg').css('display', 'none');
		}	
	}); 
}
</script>